<template>
  <div>
    <!-- 点击单位名称的页面 -->
    <div>
    <el-descriptions title="单位信息" :column="3" border size="small">
      <el-descriptions-item label="单位名称"
                            labelStyle="background-color: #DCDFE6">kooriookami</el-descriptions-item>
      <el-descriptions-item label="单位类别" labelStyle="background-color: #DCDFE6">劳务中介</el-descriptions-item>
      <el-descriptions-item label="联系人" labelStyle="background-color: #DCDFE6">张三</el-descriptions-item>
      <el-descriptions-item label="联系方式"
                            labelStyle="background-color: #DCDFE6">12783927489</el-descriptions-item>
      <el-descriptions-item label="企业信用代码" labelStyle="background-color: #DCDFE6">
        <el-tag size="small">12500000450401979R</el-tag>
      </el-descriptions-item>
      <el-descriptions-item label="备注"
                            labelStyle="background-color: #DCDFE6">欢迎大家参加我们的工作室</el-descriptions-item>
    </el-descriptions>
    </div>

    <div class="check">
            <el-checkbox-group v-model="checkList">
              <div style="margin-bottom: 20px;margin-top: 20px;font-size: medium;font-weight: 900;">认证管理
                <el-checkbox disabled label="选中且禁用" style="margin-left: 30px;">企业认证</el-checkbox>
              </div>
            </el-checkbox-group>
    </div>

            <!-- 步骤条区域 -->
            <el-steps :active="3" simple :space="100">
              <el-step title="1.填写信息" icon="el-icon-edit"></el-step>
              <el-step title="2.已审核" icon="el-icon-upload"></el-step>
              <el-step title="3.审核通过" icon="el-icon-picture"></el-step>
            </el-steps>
            <el-descriptions :column="2" border size="mini" style="margin-top: 20px;margin-right: 100px;">

              <el-descriptions-item label="法人代表" labelStyle="background-color: #DCDFE6">知非工作室</el-descriptions-item>
              <el-descriptions-item label="营业期限" labelStyle="background-color: #DCDFE6">
                <el-checkbox-group v-model="checkList">
                  <el-checkbox label="长期" disabled>长期</el-checkbox>
                  <div class="label">若无营业期限，请选择长期</div>
                </el-checkbox-group>
              </el-descriptions-item>
              <el-descriptions-item label="上传凭证" labelStyle="background-color: #DCDFE6">
                <el-image style="width: 100px; height: 100px" :src="url" :preview-src-list="srcList">
                </el-image>
                <!-- 上传营业执照 -->
                <!-- <el-upload class="upload-demo" action="https://jsonplaceholder.typicode.com/posts/"
                    :on-preview="handlePreview" :on-remove="handleRemove" list-type="picture">
                    <el-button size="small" type="primary">点击上传</el-button>
                    <div slot="tip" class="el-upload__tip">上传营业执照</div>
                </el-upload> -->
              </el-descriptions-item>
            </el-descriptions>
            <div class="label">请提供清晰、完整，无水印的新版统一社会信用代码的执照原件数码照，复印件需加盖公司红章。（最多上传1张，每张最大10M不能小于25K）</div>

            <!-- 底部区域 -->
            <span slot="footer">
              <router-link to="/notice"><el-button type="primary" style="margin-top: 80px;margin-left:400px">确 定</el-button></router-link>
      <router-link to="/notice"><el-button style="margin-left:30px">取 消</el-button></router-link>
                </span>
  </div>
</template>

<script>
export default {
  name: "Click.vue",
  data(){
    return{
      form:{},
      checkList: ['1', '选中且禁用', '长期'],
      url: 'https://ts1.cn.mm.bing.net/th/id/R-C.3f4be9ca1835e9ffc3b63c28a182494a?rik=VDMLFRgO87atnQ&riu=http%3a%2f%2fimage.guayunfan.com%2fattached%2fimage%2f20200210%2f125584%2f782feb80-e51e-409b-82a0-d01b4aaa70ca.jpg&ehk=N1V0sPTWREuhkbt8u6mZBKUz73TQN1pIz2oEeA877EM%3d&risl=&pid=ImgRaw&r=0',
      srcList: [
        'https://ts1.cn.mm.bing.net/th/id/R-C.3f4be9ca1835e9ffc3b63c28a182494a?rik=VDMLFRgO87atnQ&riu=http%3a%2f%2fimage.guayunfan.com%2fattached%2fimage%2f20200210%2f125584%2f782feb80-e51e-409b-82a0-d01b4aaa70ca.jpg&ehk=N1V0sPTWREuhkbt8u6mZBKUz73TQN1pIz2oEeA877EM%3d&risl=&pid=ImgRaw&r=0',
      ],

    }
  },
  methods:{

  }
}
</script>

<style scoped>

.label {
  color: #409EFF;
  font-size: 12px;
}
</style>